<%--
  Created by IntelliJ IDEA.
  User: 但何非
  Date: 2022/12/13
  Time: 20:41
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>统计信息</title>
    <meta name="renderer" content="webkit" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0" />
    <link rel="stylesheet" href="../../static/lib/layui/css/layui.css" media="all" />
    <link rel="stylesheet" href="../../static/css/admin.css" media="all" />
</head>
<body>

<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
    <legend>查询条件</legend>
</fieldset>

<div class="layui-form">
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">开始时间</label>
            <div class="layui-input-inline">
                <input type="text" class="layui-input" id="beginTime" placeholder="yyyyMMdd">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">结束时间</label>
            <div class="layui-input-inline">
                <input type="text" class="layui-input" id="endTime" placeholder="yyyyMMdd">
            </div>
        </div>
        <button type="button" class="layui-btn layui-btn-normal" onclick="query();">查询</button>
    </div>

</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
    <legend>充值信息</legend>
</fieldset>

<div class="layui-form">
    <table class="layui-table">
        <colgroup>
            <col width="150">
            <col width="150">
            <col width="150">
            <col width="200">
            <col width="200">
            <col>
        </colgroup>
        <thead>
        <tr>
            <th>开始时间</th>
            <th>结束时间</th>
            <th>名称</th>
            <th>笔数</th>
            <th>金额</th>
        </tr>
        </thead>
        <tbody id="payId">
        </tbody>
    </table>
</div>


<div class="layui-form">
    <table class="layui-table">
        <colgroup>
            <col width="150">
            <col width="150">
            <col width="200">
            <col>
        </colgroup>
        <thead>
        <tr>
            <th>开始时间</th>
            <th>结束时间</th>
            <th>支付宝名称</th>
            <th>笔数</th>
            <th>金额</th>
        </tr>
        </thead>
        <tbody id="paZhbListId">
        </tbody>
    </table>
</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
    <legend>提现信息</legend>
</fieldset>

<table class="layui-table">
    <colgroup>
        <col width="150">
        <col width="150">
        <col width="150">
        <col width="200">
        <col width="200">
        <col>
    </colgroup>
    <thead>
    <tr>
        <th>开始时间</th>
        <th>结束时间</th>
        <th>名称</th>
        <th>笔数</th>
        <th>金额</th>
        <th>手续费</th>
    </tr>
    </thead>
    <tbody id="withdrawId">
    </tbody>
</table>
<div class="layui-form">
    <table class="layui-table">
        <colgroup>
            <col width="150">
            <col width="150">
            <col width="200">
            <col width="200">
            <col width="200">
            <col>
        </colgroup>
        <thead>
        <tr>
            <th>开始时间</th>
            <th>结束时间</th>
            <th>支付宝名称</th>
            <th>笔数</th>
            <th>金额</th>
            <th>手续费</th>
        </tr>
        </thead>
        <tbody id="withdrawZhbListId">
        </tbody>
    </table>
</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
    <legend>用户信息</legend>
</fieldset>

<div class="layui-form">
    <table class="layui-table">
        <colgroup>
            <col width="150">
            <col width="150">
            <col width="150">
            <col width="150">
            <col>
        </colgroup>
        <thead>
        <tr>
            <th>数据名称</th>
            <th>数量</th>
            <th>数据名称</th>
            <th>金额</th>
        </tr>
        </thead>
        <tbody>
        <tr>
            <th>支付宝人数:</th>
            <th id="zfbTotalUser" style="color: red;"></th>
            <th>支付宝余额:</th>
            <th id="zfbTotalAmount" style="color: red;"></th>
        </tr>
        <tr>
            <th>银行卡人数:</th>
            <th id="bankTotalUser" style="color: red;"></th>
            <th>银行卡余额:</th>
            <th id="bankTotalAmount" style="color: red;"></th>
        </tr>
        </tbody>
    </table>
</div>

<%@ include file="/WEB-INF/view/common/includ-js.jsp" %>
<!-- Data Tables -->
<script src="${path}/static/Hui/js/plugins/dataTables/jquery.dataTables.js"></script>
<script src="${path}/static/Hui/js/plugins/dataTables/dataTables.bootstrap.js"></script>
<script src="${path}/static/plugins/layui/layui.all.js"></script>
<script>
    function staticsInfo(beginTime,endTime){
        $.ajax({
            type:"post",
            url:"${path}/statics/ys/money/info",
            dataType:"json",
            data: {beginTime:beginTime,endTime:endTime
            },
            success:function(data){
                if(data.code == 0){

                    var html = "<tr><th>"+data.data.beginTime+"</th>";
                    html += "<th>"+data.data.endTime+"</th>";
                    html += "<th>合计</th>";
                    html += "<th style='color: red;'>"+data.data.payNum+"</th>";
                    html += "<th style='color: red;'>￥"+data.data.payAmount+"</th></tr>";

                    html += "<tr><th>"+data.data.beginTime+"</th>";
                    html += "<th>"+data.data.endTime+"</th>";
                    html += "<th>银行卡</th>";
                    html += "<th style='color: red;'>"+data.data.payYhkNum+"</th>";
                    html += "<th style='color: red;'>￥"+data.data.payYhkAmount+"</th></tr>";

                    html += "<tr><th>"+data.data.beginTime+"</th>";
                    html += "<th>"+data.data.endTime+"</th>";
                    html += "<th>支付宝</th>";
                    html += "<th style='color: red;'>"+data.data.payZfbNum+"</th>";
                    html += "<th style='color: red;'>￥"+data.data.payZfbAmount+"</th></tr>";
                    $("#payId").html(html);
                    var payZfb = "";
                    for (var i=0;i<data.data.payZfb.length; i++){
                        payZfb += "<tr><th>"+data.data.beginTime+"</th>";
                        payZfb += "<th>"+data.data.endTime+"</th>";
                        payZfb += "<th>"+data.data.payZfb[i].name+"</th>";
                        payZfb += "<th>"+data.data.payZfb[i].num+"</th>";
                        payZfb += "<th style='color: red;'>￥"+data.data.payZfb[i].amount+"</th></tr>";
                    }
                    $("#paZhbListId").html(payZfb);



                    var html1 = "<tr><th>"+data.data.beginTime+"</th>";
                    html1 += "<th>"+data.data.endTime+"</th>";
                    html1 += "<th>合计</th>";
                    html1 += "<th style='color: red;'>"+data.data.withdrawNum+"</th>";
                    html1 += "<th style='color: red;'>￥"+data.data.withdrawAmount+"</th>";
                    html1 += "<th style='color: red;'>￥"+data.data.freeAmount+"</th></tr>";

                    html1 += "<tr><th>"+data.data.beginTime+"</th>";
                    html1 += "<th>"+data.data.endTime+"</th>";
                    html1 += "<th>银行卡</th>";
                    html1 += "<th style='color: red;'>"+data.data.withdrawYhkNum+"</th>";
                    html1 += "<th style='color: red;'>￥"+data.data.withdrawYhkAmount+"</th>";
                    html1 += "<th style='color: red;'>￥"+data.data.freeYhkAmount+"</th></tr>";

                    html1 += "<tr><th>"+data.data.beginTime+"</th>";
                    html1 += "<th>"+data.data.endTime+"</th>";
                    html1 += "<th>支付宝</th>";
                    html1 += "<th style='color: red;'>"+data.data.withdrawZfbNum+"</th>";
                    html1 += "<th style='color: red;'>￥"+data.data.withdrawZfbAmount+"</th>";
                    html1 += "<th style='color: red;'>￥"+data.data.freeZfbAmount+"</th></tr>";

                    $("#withdrawId").html(html1);

                    var withdrawZfb = "";
                    for (var i=0;i<data.data.withdrawZfb.length; i++){
                        withdrawZfb += "<tr><th>"+data.data.beginTime+"</th>";
                        withdrawZfb += "<th>"+data.data.endTime+"</th>";
                        withdrawZfb += "<th>"+data.data.withdrawZfb[i].name+"</th>";
                        withdrawZfb += "<th>"+data.data.withdrawZfb[i].num+"</th>";
                        withdrawZfb += "<th style='color: red;'>￥"+data.data.withdrawZfb[i].amount+"</th>";
                        withdrawZfb += "<th style='color: red;'>￥"+data.data.withdrawZfb[i].fee+"</th></tr>";
                    }
                    $("#withdrawZhbListId").html(withdrawZfb);



                    $("#zfbTotalAmount").html("￥"+data.data.zfbTotalAmount)
                    $("#zfbTotalUser").html(data.data.zfbTotalUser)
                    $("#bankTotalAmount").html("￥"+data.data.bankTotalAmount)
                    $("#bankTotalUser").html(data.data.bankTotalUser)
                }else{
                    layer.alert(data.msg, {icon: 2});
                }
            }
        });
    }
    layui.use('laydate', function() {
        var laydate = layui.laydate;
        laydate.render({
            elem: '#beginTime'
            ,format: 'yyyyMMdd'
        });
        laydate.render({
            elem: '#endTime'
            ,format: 'yyyyMMdd'
        });
    });
    function query(){
        staticsInfo($("#beginTime").val(),$("#endTime").val());
    }
    staticsInfo($("#beginTime").val(),$("#endTime").val());
</script>
</body>
</html>
